import {reactive} from "plain-design-composition";
import {delay} from "plain-utils/utils/delay";
import {$$message} from "plain-design";
import {nav} from "@/micro/nav/nav";

export interface iManagerMenu {
    name: string,
    path: string,
    homeFlag?: true,
}

export interface iManagerMenuGroup {
    name: string,
    icon: string,
    collapse: boolean,
    menus: iManagerMenu[],
}

export const ManagerMenuService = (() => {

    const state = reactive({
        MenuGroups: [] as iManagerMenuGroup[],
        isLoading: false,
    })

    const init = async () => {
        state.isLoading = true
        await delay(1000)
        state.isLoading = false
        state.MenuGroups = [
            {
                name: '仪表盘',
                icon: 'el-icon-s-promotion',
                collapse: true,
                menus: [
                    {name: '数据统计', path: 'dashboard/data-statistic/index', homeFlag: true},
                    {name: '系统监控', path: 'dashboard/system-monitor/index'},
                    {name: '工作台', path: 'dashboard/workspace/index'},
                ]
            },
            {
                name: '列表页',
                icon: 'el-icon-list',
                collapse: true,
                menus: [
                    {name: '基础列表', path: 'list/basic-list'},
                    {name: '高级列表', path: 'list/pro-table'},
                    {name: '表单编辑', path: 'list/edit-form'},
                    {name: '图片列表', path: 'list/image-table'},
                ]
            },
            {
                name: '表单页',
                icon: 'el-icon-edit-outline',
                collapse: true,
                menus: [
                    {name: '基础表单', path: 'form/basic-form'},
                    {name: '分步表单', path: 'form/step-form'},
                    {name: '高级表单', path: 'form/senior-form'},
                ]
            },
            /*{
                name: '详情页面',
                icon: 'el-icon-document',
                collapse: true,
                menus: [
                    {name: '基础详情', path: 'detail/basic-detail'},
                    {name: '头行结构', path: 'detail/complex-detail'},
                ]
            },*/
            {
                name: '结果页',
                icon: 'el-icon-position',
                collapse: true,
                menus: [
                    {name: '成功页', path: 'result/result-403'},
                    {name: '失败页', path: 'result/result-404'},
                    {name: '404页', path: 'result/result-500'},
                    {name: '403页', path: 'result/result-error'},
                    {name: '500页', path: 'result/result-success'},
                ]
            },
            {
                name: '子应用',
                icon: 'el-icon-paperclip',
                collapse: true,
                menus: [
                    {name: '一、高级列表(1)', path: 'list/pro-table'},
                    {name: '一、高级列表(2)', path: 'list/pro-table'},
                    {name: '二、React子应用', path: 'sub-react/message/list'},
                    {name: '三、Vue子应用', path: 'sub-vue/message/list'},
                    {name: '四、ReactVite子应用', path: 'sub-react-vite/message/list'},
                    {name: '五、VueVite子应用', path: 'sub-vue-vite/message/list'},
                    {name: '六、VueRouter:list', path: 'sub-router-vue/list'},
                    {name: '六、VueRouter:list2', path: 'sub-router-vue/list'},
                    {name: '六、VueRouter:about', path: 'sub-router-vue/about'},
                    {name: '七、ReactRouter:list', path: 'sub-router-react/list'},
                    {name: '七、ReactRouter:list2', path: 'sub-router-react/list'},
                    {name: '七、ReactRouter:about', path: 'sub-router-react/about'},
                    {name: '八、iframe:umi:list', path: 'sub-router-umi/list'},
                    {name: '八、iframe:umi:list2', path: 'sub-router-umi/list'},
                    {name: '八、iframe:umi:welcome', path: 'sub-router-umi/welcome'},
                ]
            },
            {
                name: '路由页',
                icon: 'el-icon-place',
                collapse: true,
                menus: [
                    {name: 'Home路由', path: 'test/test-home-route'},
                    {name: 'Private路由', path: 'test/test-private-route'},
                    {name: 'Public路由', path: 'test/test-public-route'},
                    {name: 'Page路由', path: 'test/test-page-route'},
                ]
            },
            {
                name: '练习题',
                icon: 'el-icon-setting',
                collapse: true,
                menus: [
                    {name: '练习题', path: 'other/exercise-list'},
                    {name: '选项值(勿动)', path: 'other/ov-list'},
                    {name: 'CMS内容(勿动)', path: 'other/cms-list'},
                    {name: '测试Markdown', path: 'other/markdown-demo'},
                    {name: '测试Monaco', path: 'other/monaco-demo'},
                ],
            },
            /*{
                name: '用户设置',
                icon: 'el-icon-s-custom',
                collapse: true,
                menus: [
                    {name: '个人中心', path: 'user/user-config'},
                    {name: '个人设置', path: 'user/user-info'},
                ]
            },*/
        ]
    }

    const clear = () => {
        state.MenuGroups = []
    }

    const openHome = () => {
        const homePage = state.MenuGroups.map(i => i.menus).flat().find(i => i.homeFlag)
        if (!homePage) {
            return $$message.error('找不到首页！')
        } else {
            openMenu(homePage)
        }
    }

    const openMenu = (menu: iManagerMenu) => {
        const group = state.MenuGroups.find(i => i.menus.indexOf(menu) > -1)
        if (!group) {
            throw new Error(`menu isn't belong to any menu group!`)
        }
        nav.tab.open({
            path: menu.path,
            title: menu.name,
            icon: group.icon,
            id: `${group.name}-${menu.name}-${menu.path}`,
            data: {
                menu,
                group,
            },
        })
    }

    return {
        state,
        init,
        clear,
        openHome,
        openMenu,
    }
})();
